<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="../layui/css/layui.css" type="text/css" >
    <style type="text/css">
        * {
            color: white;
            margin: 0;
            padding: 0;
            border: none;
        }

        .header {
            width: 100%;
            height: 100px;
            margin: 0 auto;
        }

        .container {
            height: 1000px;
            width: 1000px;
            margin: 0 auto;
        }

        .container .main {
            float: left;
            width:600px;
            height:1000px;
        }
        .container .subsideBox {
            float: left;
            width: 200px;
            height: 1000px;
        }
        .container .side {
            float: right;
            width: 200px;
            height: 1000px;
        }
        .footer {
            width: 100%;
            height: 80px;
            background: #eeeeee;
            margin: 0 auto;
            padding-bottom: 0;
        }
        .footer-1 {
            width: 100%;
            height: 80px;
            background: #eeeeee ;
            margin: 0 auto;
            padding-top: 0px;
        }
        video{
            position: fixed;
            right: 0px;
            bottom: 0px;
            min-width: 100%;
            min-height: 100%;
            height: auto;
            width: auto;
            /*加滤镜*/
            /*filter: blur(15px); //背景模糊设置 */
            /*-webkit-filter: grayscale(100%);*/
            /*filter:grayscale(100%); //背景灰度设置*/
            z-index:-11
        }
        source{
            min-width: 100%;
            min-height: 100%;
            height: auto;
            width: auto;
        }
        <!----------------------百度框--------------------------->


            .demo {
                margin: 16px;
            }

        .keyword {
            width: 600px;
            height: 40px;
            font-size: 16px;
            padding: 0;
            border: 2px solid #AAAAAA;
            border-top-left-radius: 10px;
            border-bottom-left-radius: 10px;
        }
        .keyword:hover {border: 2px solid #F0F0F0;}
        .keyword:focus {border: 2px solid #AAAAAA;}

        .submit {
            top: 10px;
            margin-left: -4px;
            margin-top: 4px;
            font-size: 16px;
            font: 1.5em"宋体";
            color: #FFFFFF;
            height: 42px;
            border: none;
            background: #4e6ef2;
            border: #F0F0F0;
            padding: 0 24px;
            border-top-right-radius: 16px;
            border-bottom-right-radius: 10px;
        }

        .submit:hover {

            background: #2A4AA0;
        }

        img {
            left: 1470px;
            top:21px;
            witch: 15px;
            height: 15px;
            position: absolute;
        }
        <!-------------------------->

    </style>

</head>
<body>
<div>
    <video src="zp/大气蓝色科技线条网格背景视频.mp4" class="bjimg" autoplay loop muted></video>

    <div class="header"style=" background: url(zp/OIP-C.jpg)no-repeat ; background-size:100% 100%;background-color: #eeeeee " with="400px" height="200px">

    <div class="round"  >

        <ul class="layui-nav" lay-filter=""  style="position: absolute;z-index: 999;width: 100%;background-color: rgba(255,255,255,0.3)!important;">
            <li class="layui-nav-item"><a href="">最新活动</a></li>
            <li class="layui-nav-item layui-this"><a href="">产品</a></li>
            <li class="layui-nav-item"><a href="">大数据</a></li>
            <li class="layui-nav-item">
                <a href="javascript:;">解决方案</a>
                <dl class="layui-nav-child"> <!-- 二级菜单 -->
                    <dd><a href="" >移动模块</a></dd>
                    <dd><a href="">后台模版</a></dd>
                    <dd><a href="">电商平台</a></dd>
                </dl>
            </li>
            <li class="layui-nav-item"><a href="">社区</a></li>
        </ul>
        <div class="demo" align="right">
            <input type="text" class="keyword" >
            <button class="submit" >百度一下</button>
            <img src="zp/bg.jpg">
        </div>
    </div>


    <script src="../layui/layui.js"></script>
    <script>
        //注意：导航 依赖 element 模块，否则无法进行功能性操作
        layui.use('element', function(){
            var element = layui.element;

            //…
        });
    </script>


    </div>

<div class="container" style="background: url(zp/bg.jpg)">
    <div class="footer-1" align="center" >
        <ul class="">

        </ul>

    </div>
    <div class="main">
        <h2>会员注册表</h2>
        <form name="name1" action="http://192.168.8.61/api/base/one" method="post">
            <ul style=" background-color: rgba(32, 74, 102, 0);
">
                <p> 账号：<input type="text" required name="username"></p>
                <p> 密码：<input type="password" required name="pass"></p>
                性别: <input type="radio" name="sex" value="1" checked/>男
                <input type="radio" name="sex" value="2"/>女
                <br/>
                <p> 爱好：<input type="checkbox" name="like[0]" value="音乐"/>音乐
                    <input type="checkbox" name="like[1]" value="上网" checked/>上网
                    <input type="checkbox" name="like[2]" value="足球"/>足球
                    <input type="checkbox" name="like[3]" value="下棋"/>下棋
                    <br/></p>
                <p>
                    职业：<select name="work">
                    <option value="政府职员">政府职员</option>
                    <option value="工程师" selected="selected">工程师</option>
                    <option value="工人">工人</option>
                    <option value="教师">教师</option>
                    <option value="医生">医生</option>
                    <option value="学生">学生</option>
                </select></p>
                <p>
                    收入：<select name="salary" >
                    <option value="1000元以下">1000元以下</option>
                    <option value="1000-2000元" selected="selected">1000-2000元</option>
                    <option value="2000-3000元" selected="selected">2000-3000元</option>
                    <option value="3000-4000元" selected="selected">3000-4000元</option>
                    <option value="4000元以上">4000元以上</option>
                </select>
                </p>
                <p>电子邮箱：<input type="email" required name="email" id="email" placeholder="你的电子邮箱"/></p>
                <p>生日：<input type="date" min="1960-01-01" max="2017-3-16" name="birthday" id="birthday" value="1990-11-11"/></p>
                <p>博客地址：<input type="url" name="blog" placeholder="你的博客地址" id="blog"/></p>
                <p>年龄：<input type="number" name="age" id="age" value="25" autocomplete="off" placeholder="您的年龄"/></p>
                <p>工作年限：<input type="range" min="1" step="1" max="20" name="slider"  placeholder="您的工作年限" value="3"></p>
                <p>个人简介：<textarea name="think" cols="40" rows="4"></textarea> </p>
                <p>
                    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="submit" name="submit" value="提交">&nbsp;&nbsp;
                    <input type="reset" name="rest" value="重写"/>
                </p>
            </ul></form>
    </div>
    <div class="subsideBox" style="color: red;>

    </div>
    <div class="side">

    </div>
</div>
<div class="footer">


</div></div>
</body>
</html>